<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page import="com.demo.main.utils.CommonUtil" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page isErrorPage="true" %>
<c:set var="characterEncoding" value="UTF-8" scope="request"/>

<%
    response.setStatus(HttpServletResponse.SC_INTERNAL_SERVER_ERROR);
%>
<html lang="zh-CN">
<head>
    <title>${applicationScope.PROJECT_NAME}-500</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, shrink-to-fit=no">
    <%--图标icon--%>
    <link rel="icon" href="${pageContext.request.contextPath}/favicon.ico" type="image/ico">
    <link rel="stylesheet"
          href="${pageContext.request.contextPath}/lib/bootstrap-5.3.0-alpha1-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/global.css">
    <%--  <link rel="stylesheet" href="${pageContext.request.contextPath}/css/main.css">--%>
    <script src="${pageContext.request.contextPath}/lib/bootstrap-5.3.0-alpha1-dist/js/bootstrap.bundle.min.js"></script>
    <script src="${pageContext.request.contextPath}/lib/jquery-3.5.1.min.js"></script>
    <style>
        body {
            display: flex;
            align-items: center;
            justify-content: center;
            padding-top: 40px;
            padding-bottom: 40px;
            background-color: #f5f5f5;
        }

        .error-box {
            width: 100%;
            max-width: 400px;
            padding: 30px;
            background-color: #ffffff;
            border-radius: 10px;
            box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
            position: relative;
            top: -100px;
            text-align: center;
        }

        .error-message {
            font-size: 24px;
            color: #dc3545;
            margin-top: 20px;
            margin-bottom: 20px;
        }

        .error-details {
            font-size: 12px;
            color: #6c757d;
            text-align: left;
            margin-top: 20px;
        }

        .home-link {
            color: #007bff;
            text-decoration: none;
            transition: color 0.15s ease-in-out;
        }

        .home-link:hover {
            color: #0056b3;
            text-decoration: underline;
        }
    </style>
    <script src="${pageContext.request.contextPath}/lib/bootstrap-5.3.0-alpha1-dist/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/lib/bootstrap-5.3.0-alpha1-dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div class="error-box">
    <h1 class="h3 mb-3 fw-normal">${applicationScope.PROJECT_NAME}</h1>

    <% if (exception != null) { %>
    <div>
        <pre>页面未找到</pre>
    </div>
    <% System.err.println(exception.getMessage()); %>
    <% System.err.println(exception.toString()); %>
    <% } else { %>
    <div class="error-message">
        发生了未知错误!
    </div>
    <% } %>

    <a href="${pageContext.request.contextPath}/" class="home-link">返回首页</a>
</div>
<jsp:include page="/footer"/>
</body>
</html>